<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>资产管理</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<!--矢量图标样式-->
		<link rel="stylesheet" type="text/css" href="../font/iconfont.css" />
		<!--weui样式-->
		<link rel="stylesheet" type="text/css" href="../common_css/weui.css" />
		<!--html,body,通用头部样式-->
		<link rel="stylesheet" type="text/css" href="../common_css/common.css" />
		<!--自己的样式-->
		<link rel="stylesheet" type="text/css" href="css/asset_management.css" />
		<script src="../common_js/common_font.js"></script>
		
		<style type="text/css">
			/*弹出提示框的内容*/
			#asset_management_prompt {
				width: 100%;
				height: 100%;
				/*border: 1px solid red;*/
				position: absolute;
				top: 0px;
				left: 0px;
				display: none;
				background-color: rgba(0, 0, 0, 0.5);
			}
			
			#asset_management_prompt_content {
				width: 2.5rem;
				height: 1.2rem;
				/*border: 1px solid blue;*/
				position: absolute;
				top: 0px;
				left: 0px;
				right: 0px;
				bottom: 0px;
				margin: auto;
				border-radius: 20px;
				background-color: white;
			}
			
			.prompt_content_on {
				width: 100%;
				height: 0.4rem;
				/*border: 1px solid red;*/
				text-align: center;
				line-height: 0.4rem;
				font-size: 0.16rem;
				font-weight: bold;
				font-family: "微软雅黑";
				color: #666666;
			}
			
			.prompt_content_center {
				width: 100%;
				height: 0.4rem;
				/*border: 1px solid red;*/
				text-align: center;
				border-bottom: 2px solid #D5D5D5;
				line-height: 0.3rem;
				font-size:0.12rem;
				color: #666666;
			}
			
			.prompt_content_up {
				width: 100%;
				height: 0.4rem;
				/*border: 1px solid red;*/
				text-align: center;
				line-height:0.4rem;
				color: #21538D;
				font-size: 0.14rem;
			}
			
			.prompt_content_up_left {
				width: 50%;
				height: 0.4rem;
				/*border: 1px solid blue;*/
				text-align: center;
				line-height:0.4rem;
				float: left;
				border-right: 2px solid #D5D5D5;
			}
			
			.prompt_content_up_right {
				width: 50%;
				height:0.4rem;
				/*border: 1px solid blue;*/
				text-align: center;
				line-height:0.4rem;
				float: left;
			}
		</style>
	</head>

	<body>
		<!--总体div-->
		<div id="asset_management_main">
			<!--通用头部-->
			<div class="all_top">
				<a href="javascript:;"><i class="iconfont icon-back icon-myback"></i></a><span>资产管理</span>
				<span class="icon-mycaidan" v-on:click="management_show"><img  src="../commonimg/更多@2x.png"/></span>
				<!--左上角的信息显示-->
				<div class="asset_management_menu" id="asset_management_show">
					<!--放小三角形的div开始-->
					<div class="asset_management_trianglediv">
						<!--三角形-->
						<div class="asset_management_triangle"></div>
						<!--三角形结束-->
					</div>
					<!--放小三角形的div结束-->
					<!--信息显示-->
					<div class="asset_management_show">
						<p class="asset_management_p"  id="bank_card_pop">银行卡</p>
						<p class="asset_management_p" id="account_manager_pop">账户管理</p>
						<p class="asset_management_p" id="trading_record">交易记录</p>
					</div>
					<!--信息显示结束-->
				</div>
				<!--左上角的信息显示结束-->
			</div>
			<!--通用头部结束-->
			<!--内容显示-->
			<div class="asset_management_content">
				<!--上部分带有蓝色背景的div容器-->
				<div class="asset_management_div">
					<!--钱袋余额显示div-->
					<div class="asset_management_purse">
						<div class="asset_management_img">
							<img src="../commonimg/qiandai.png" />
						</div>
						<div class="asset_management_characters">余额(元)</div>
						<div class="asset_management_number">1324.00</div>
					</div>
					<!--钱袋余额显示div结束-->
					<!--持仓市值等的文字显示div-->
					<div class="asset_management_divbottom">
						<!--持仓市值div-->
						<div class="asset_management_marketvalue">持仓市值:<span class="marketvalue">1234.00</span></div>
						<!--持仓市值div结束-->
						<!--可用余额div-->
						<div class="asset_management_balance">可用余额: <span class="balance">1324.00</span></div>
						<!--可用余额div结束-->
					</div>
					<!--持仓市值等的文字显示div结束-->
				</div>
				<!--上部分带有蓝色背景的div容器结束-->
				<!--充值提现等总div-->
				<div class="asset_management_bottom">
					<a class="weui-cell weui-cell_access" href="javascript:;" v-on:click="toppup">
						<div class="weui-cell__hd">
							<img src="../commonimg/img1.png" style="width:20px;margin-right:5px;display:block">
						</div>
						<div class="weui-cell__bd">
							<p class="recharge">充值</p>
						</div>
						<div class="weui-cell__ft weui-cell__ft1" style="font-size: 12px;"></div>
					</a>
					<a class="weui-cell weui-cell_access" href="javascript:;" v-on:click="withdraw">
						<div class="weui-cell__hd">
							<img src="../commonimg/img2.png" style="width:20px;margin-right:5px;display:block">
						</div>
						<div class="weui-cell__bd">
							<p class="withdraw_deposit">提现</p>
						</div>
						<div class="weui-cell__ft weui-cell__ft1" style="font-size: 12px;"></div>
					</a>
					<!--充值提现等总div结束-->

				</div>

				<!--内容显示结束-->
			</div>
			<!--//提示弹出框-->
			<div id="asset_management_prompt">
				<div id="asset_management_prompt_content">
					<div class="prompt_content_on">
						提示
					</div>
					<div class="prompt_content_center">
						需要补充支付密码才能操作
					</div>
					<div class="prompt_content_up">
						<div class="prompt_content_up_left">取消</div>
						<div class="prompt_content_up_right" v-on:click="prompt_content_up_confirm">确定</div>
					</div>
				</div>
			</div>
			<!--提示结束-->
			<!--总体div结束-->
		</div>

		<script src="../common_js/jquery-1.11.0.min.js"></script>
		<script src="../common_js/vue.js"></script>
		<!--公共的点击预约的加号的按钮的跳转以及点击每页左上角的跳转-->
		<script src="../common_js/onclick_pop_view.js"></script>
		<script type="text/javascript">
			var myvue = new Vue({
				el: "body",
				data: {

				},
				methods: {
					management_show: function() {
						$("#asset_management_show").toggle();
					},
					toppup:function  () {
						$("#asset_management_prompt").show();
					},
					prompt_content_up_confirm:function(){
					    location.href = "../verification_body_message/verification_body_message.html";	
					},
					withdraw:function  () {
						 location.href = "../Withdrawal/withdrawal.html";	
					}
				},

			});
//			点击银行卡的跳转
   $("#bank_card_pop").on("click",function  () {
   	    location.href = "../bankcard/bankcard.html";
   });
   //			点击账户管理的跳转
   $("#account_manager_pop").on("click",function  () {
   	    location.href = "../secondstar_accout/secondstar_accout.html";
   });
      //			点击交易记录的跳转
   $("#trading_record").on("click",function  () {
   	    location.href = "../transactionrecord/transactionrecord.html";
   });
		</script>

	</body>

</html>